<!DOCTYPE html>
<html lang="en">
<head>
    <title>定时任务</title>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <link rel="stylesheet" href="../../css/bootstrap.min.css">
    <link rel="stylesheet" href="../../css/font-awesome.min.css">
    <link rel="stylesheet" href="../../plugins/jqgrid/ui.jqgrid-bootstrap.css">
    <link rel="stylesheet" href="../../plugins/ztree/css/metroStyle/metroStyle.css">
    <link rel="stylesheet" href="../../css/main.css">
    <!-- <link rel="stylesheet" href="../../css/button.css"> -->
    <script src="../../libs/jquery.min.js"></script>
    <script src="../../plugins/layer/layer.js"></script>
    <script src="../../libs/bootstrap.min.js"></script>
    <script src="../../libs/vue.min.js"></script>
    <script src="../../libs/validator.min.js"></script>
    <script src="../../plugins/jqgrid/grid.locale-cn.js"></script>
    <script src="../../plugins/jqgrid/jquery.jqGrid.min.js"></script>
    <script src="../../plugins/ztree/jquery.ztree.all.min.js"></script>
    <script src="../../plugins/jquery-validation/jquery.validate.min.js"></script>
    <script src="../../plugins/jquery-validation/jquery.validate.addMethod.js"></script>
    <script src="../../js/common.js"></script>
    <script src="../../js/modules/platform/My97DatePicker/WdatePicker.js"></script>

    <script src="../../libs/websocket/sockjs.min.js"></script>
    <script src="../../libs/websocket/stomp.js"></script>

    <!--<script th:src="@{../../libs/jquery.min.js}"></script>-->
    <!--<script th:src="@{../../libs/websocket/stomp.js}"></script>-->
    <!--<script th:src="@{../../libs/websocket//jquery-3.1.1.js}"></script>-->

    <style type="text/css">
        .fz10{
            font-size:10px;
        }
    </style>
</head>
<body>
<div id="rrapp" v-cloak>


    <div v-show="showList">
        <div class="grid-btn" style="height:34px;">
            <div class="form-group col-sm-5">
                名称:<input type="text" style="display:inline; width:100px;" class="form-control" v-model="q.name"
                          placeholder="优惠券名称">
                <a style="margin-left:10px;" class="btn btn-default" @click="query">查询</a>
            </div>

            <a v-if="hasPermission('sys:sysCoupon:update')" class="btn btn-primary" @click="update"><i
                    class="fa fa-pencil-square-o"></i>&nbsp;修改</a>
            <a v-if="hasPermission('sys:sysCoupon:delete')" class="btn btn-primary" @click="del"><i
                    class="fa fa-trash-o"></i>&nbsp;删除</a>


        </div>
        <table id="jqGrid"></table>
        <div id="jqGridPager"></div>
    </div>

    <div v-show="!showList" class="panel panel-default">
        <div class="panel-heading">{{title}}</div>
        <form class="form-horizontal" id="form">
            <div class="form-group">
                <input type="hidden" class="form-control form-tip" id="id" v-model="coupon.id"/>
                <div class="col-sm-2 control-label">优惠券名称:</div>
                <div class="col-sm-10">
                    <!--<input type="text" class="form-control" v-model="coupon.name" placeholder="优惠券名称" id="name" name="name"/>-->
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label">优惠券金额:</div>
                <div class="col-sm-10">
                    <input type="text" class="form-control" v-model="coupon.money" placeholder="优惠券金额" id="money"
                           name="money"/>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label">编号:</div>
                <div class="col-sm-10">
                    <input type="text" readonly="readonly" class="form-control" v-model="coupon.code" placeholder="编号"
                           id="code" name="code"/>
                </div>
            </div>
            <!-- <div class="form-group">
                   <div class="col-sm-2 control-label">到期时间:</div>
                   <div class="col-sm-10">
                  <input type="text" class="form-control" v-model="coupon.validity" placeholder="到期时间"  id="" name=""/>
                </div>
            </div> -->
            <div class="form-group">
                <div class="col-sm-2 control-label">到期时间</div>
                <div class="col-sm-10">
                    <input v-model="coupon.validity" id="validity" name="validity" type="text"
                           onClick="WdatePicker({el:this,dateFmt:'yyyy-MM-dd HH:mm:ss',minDate: '%y-%M-%d 00:00:00'})">
                    <font color=red>点我弹出日期控件</font>

                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label"></div>
                <input type="button" class="btn btn-primary" onclick="upd()" value="确定"/>
                &nbsp;&nbsp;<input type="button" class="btn btn-warning" @click="reload" value="返回"/>
            </div>
        </form>
    </div>
</div>
<script src="../../js/modules/test/testlist.js"></script>
<script type="text/javascript">
    function validform() {
        /*关键在此增加了一个return，返回的是一个validate对象，这个对象有一个form方法，返回的是是否通过验证*/
        return $("#form").validate({
            rules: {
                name: {
                    required: true,
                    minlength: 2,
                    maxlength: 10
                },
                money: {
                    required: true,
                    money: true
                }


            },
            messages: {
                name: {
                    required: '优惠券名必填',
                    minlength: '最少输入2个字符',
                    maxlength: '最多输入10个字符',
                },
                money: {
                    required: "优惠券金额必须填写"
                }

            }
        });
    }
    //注册表单验证
    $(validform());
    function upd() {
        if (validform().form()) {
            var id = $("#id").val();
            var name = $("#name").val();
            if (isBlank(name)) {
                alert("优惠券名称必须填写")
                return;
            }
            var money = $("#money").val();
            if (isBlank(money)) {
                alert("优惠券金额必须填写")
                return;
            }
            var SysUser = {"name": name, "money": money, "code": code};
            var validity = $("#validity").val();
            if (isBlank(validity)) {
                alert("到期时间必须填写")
                return;
            }
            var code = $("#code").val();
            if (isBlank(code)) {
                alert("交易平台编码必须填写")
                return;
            }
            $.ajax({
                type: "post",
                url: baseURL + 'sys/test/update',
                data: {"id": id, "name": name, "money": money, "code": code, "alidity": validity},
                success: function (r) {
                    if (r.code == 0) {
                        alert('操作成功', function () {
                            window.location.reload();
                        });
                    } else {
                        alert(r.msg);
                    }
                },
            });
        } else {
            alert("请按照提示正确填写信息!");
        }
    }
</script>
<h1>______________________________________________________________________</h1>
<div>
    <div>
        <button id="connect" onclick="connect();">连接</button>
        <button id="disconnect" disabled="disabled" onclick="disconnect();">断开连接</button>
    </div>
    <div id="conversationDiv">
        <label>输入你的名字</label><input type="text" id="name"/>
        <button id="sendName" onclick="sendName();">发送</button>
        <p id="response"></p>
    </div>
</div>
<script type="text/javascript">
    var stompClient = null;
    function setConnected(connected) {
        document.getElementById("connect").disabled = connected;
        document.getElementById("disconnect").disabled = !connected;
        document.getElementById("conversationDiv").style.visibility = connected ? 'visible' : 'hidden';
        $("#response").html();
    }
    function connect() {
        var socket = new SockJS('/endpointWeb');
        stompClient = Stomp.over(socket);
        stompClient.connect({}, function (frame) {
            setConnected(true);
            console.log('Connected:' + frame);
            stompClient.subscribe('/topic/getResponse', function (response) {
                showResponse(JSON.parse(response.body).responseMessage);
            })
        });
    }
    function disconnect() {
        if (stompClient != null) {
            stompClient.disconnect();
        }
        setConnected(false);
        console.log('Disconnected');
    }
    function sendName() {
        var name = $('#name').val();
        console.log('name:' + name);
        stompClient.send("/welcome", {}, JSON.stringify({'name': name}));
    }
    function showResponse(message) {
        $("#response").html(message);
    }
</script>
</body>
</html>